<!DOCTYPE html>
<html>
	<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
	<link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.3.0/bootstrap.min.css">
	<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
	  <script>
	  /* when document is ready */
	  $(function() {
		/* initiate plugin */
		$("div.holder").jPages({
		  containerID: "itemContainer"
		});
	  });
	  </script>
	<style type="text/css">
	a.disabled {
		text-decoration: none;
		color: black;
		cursor: default;
	}
	 #example4,
	 #example4-pagination {
		display: none;
	}
	.tbl1 {
		background-image:url(../images/datebox.png) no-repeat 4px 4px; border:1px solid red;
    }
	  .holder {
			margin: 15px 0;
	  }
	  .holder a {
		font-size: 12px;
		cursor: pointer;
		margin: 0 5px;
		color: #333;
	  }
	  .holder a:hover {
		background-color: #222;
		color: #fff;
	  }
	  .holder a.jp-previous { margin-right: 15px; }
	  .holder a.jp-next { margin-left: 15px; }
	  .holder a.jp-current, a.jp-current:hover {
		color: #FF4242;
		font-weight: bold;
	  }
	  .holder a.jp-disabled, a.jp-disabled:hover {
		color: #bbb;
	  }
	  .holder a.jp-current, a.jp-current:hover,
	  .holder a.jp-disabled, a.jp-disabled:hover {
		cursor: default;
		background: none;
	  }
	  .holder span { margin: 0 5px; }
	  table{
		border-collapse:collapse;
		width:100%;
	  }
	  table, td, th
	  {
	   border:1px solid black;
	  }
	    
	</style>
	
<body>

<!--CONTENT SECTION START-->

<div id="main-wrapper-sec">

<section>

	<!--INNER MAIN TITLE SECTION START-->

    <h2 class="inner-main-title pr-title">login</h2>
    
    <!--INNER MAIN TITLE SECTION END-->
    
    <!--CONTENT MAIN SECTION START-->
    
  <div class="content-main-sec cd-main-sec">
  
  <!--INNER CONTENT LEFT MENU SECTION START-->
  
  <ul class="inner-left-menu-sec">
    <?php include('leftmenu.phtml');?>
  </ul>
  
  <!--INNER CONTENT LEFT MENU SECTION END-->
  
  <!--INNER CONTENT RIGHT SECTION START-->
  
  <article class="inner-cont-right-sec">
  
  <h1 class="inner-cont-title">Call Details
  <strong><img src="<?php echo $this->basePath(); ?>/images/phone-icon.png" alt="">Call Detail Records</strong>
  </h1>
  
  <div class="clear"></div>
  
  <!--CALL DETAILS CONTENT MAIN SECTION START-->
  <form id="formid" method="post" >
	  <ul class="login-form-sec">
		  <li>
		  <div class="from-date-sec"><span class="display">From:</span>
		  <input class="input_w tbl1" type="text" id="datepicker" name="datepicker" class="tbl1" value="<?php if(isset($_POST['datepicker'])){ echo $_POST['datepicker'];} ?>" /> 
		  </div>
		  
		  <div class="to-date-sec"><span class="display">To:</span>
		 <input class="input_w" type="text" id="datepicker_to" name="datepicker_to" value="<?php if(isset($_POST['datepicker_to'])){ echo $_POST['datepicker_to'];} ?>" />
		  </div>
		  <div class="to-date-sec"><span class="display">&nbsp;</span>
			<input class="call_btn" type="button" value="GO"  onclick="dateValue()" />
		  </div>
		 
		   <div class="by-country-sec" style=""><span class="display">By Timezone</span>
			<select class="select_h" name="timezone" id="timezone" onchange="zoneTime()">
				<option value='0'>GMT</option>
				<option <?php if(isset($timezone)){ if($timezone == "-12"){ echo "selected";} } ?> value="-12"/>(-12:00) Eniwetok,Kwajalein</option>
				<option <?php if(isset($timezone)){ if($timezone=='-11'){ echo "selected";} } ?> value='-11'>(-11:00) Midway Island,samoa</option>
				<option <?php if(isset($timezone)){ if($timezone == '-10'){ echo "selected";} } ?> value='-10'>(-10:00) Hawaii</option>
				<option <?php if(isset($timezone)){ if($timezone == '-9'){ echo "selected";} } ?> value='-9'>(-9:00) Aleska</option>
				<option <?php if(isset($timezone)){ if($timezone == '-8'){ echo "selected";} } ?> value='-8'>(-8:00) Us/Canada Pacific Time</option>
				<option <?php if(isset($timezone)){ if($timezone == '-7'){ echo "selected";} } ?> value='-7'>(-7:00) Us/Canada Mountain Time</option>
				<option <?php if(isset($timezone)){ if($timezone == '-6'){ echo "selected";} } ?> value='-6'>(-6:00) Us/Canada Central,Mexico City</option>
				<option <?php if(isset($timezone)){ if($timezone == '-5'){ echo "selected";} } ?> value='-5'>(-5:00) Us/Canada Eastem,Bogota,Lima </option>
				<option <?php if(isset($timezone)){ if($timezone == '-4'){ echo "selected";} } ?> value='-4'>(-4:00) Caracas</option>
				<option <?php if(isset($timezone)){ if($timezone == '-04'){ echo "selected";} } ?> value='-04'>(-4:00) Curacao ,La Paz</option>
				<option <?php if(isset($timezone)){ if($timezone == '-3'){ echo "selected";} } ?> value='-3'>(-3:00) Newfoundland</option>
				<option <?php if(isset($timezone)){ if($timezone == '-03'){ echo "selected";} } ?> value='-03'>(-3:00) Brazil,Buenos Aires,Georgetown</option>
				<option <?php if(isset($timezone)){ if($timezone == '-2'){ echo "selected";} } ?> value='-2'>(-2:00) Mid-Atlantic</option>
				<option <?php if(isset($timezone)){ if($timezone == '-1'){ echo "selected";} } ?> value='-1'>(-1:00) Azores,Cape Verde Islands</option>
				<option <?php if(isset($timezone)){ if($timezone == '0:00'){ echo "selected";} } ?> value='0:00'>(0:00) Westron Europe,London,Lisbon</option>
				<option <?php if(isset($timezone)){ if($timezone == '00:00'){ echo "selected";} } ?> value='00:00'>(0:00) Casablanca</option>
				<option <?php if(isset($timezone)){ if($timezone == '1:00'){ echo "selected";} } ?> value='1:00'>(1:00) Brussels,Rome,Madrid,Paris</option>
				<option <?php if(isset($timezone)){ if($timezone == '2:00'){ echo "selected";} } ?> value='2:00'>(2:00) Helsinki,Riga,Tallinn,Vilnius</option>
				<option <?php if(isset($timezone)){ if($timezone == '02:00'){ echo "selected";} } ?> value='02:00'>(2:00) Istambul</option>
				<option <?php if(isset($timezone)){ if($timezone == '002:00'){ echo "selected";} } ?> value='002:00'>(2:00) SouthAfrica</option>
				<option <?php if(isset($timezone)){ if($timezone == '0002:00'){ echo "selected";} } ?> value='0002:00'>(2:00) Telaviva</option>
				<option <?php if(isset($timezone)){ if($timezone == '03:00'){ echo "selected";} } ?> value='03:00'>(3:00) Moscow,St.Petersburg</option>
				<option <?php if(isset($timezone)){ if($timezone == '3:30'){ echo "selected";} } ?> value='03:30'>(3:30) Tehran</option>
				<option <?php if(isset($timezone)){ if($timezone == '04:00'){ echo "selected";} } ?> value='04:00'>(4:00) Abu Dhabi,Muscat,Baku,Tbilisi</option>
				<option <?php if(isset($timezone)){ if($timezone == '4:30'){ echo "selected";} } ?> value='4:30'>(4:30) Kabul</option>
				<option <?php if(isset($timezone)){ if($timezone == '05:00'){ echo "selected";} } ?> value='05:00'>(5:00) Islamabad,Karachi</option>
				<option <?php if(isset($timezone)){ if($timezone == '5:00'){ echo "selected";} } ?> value='5:00'>(5:00) Ekaterinburg,Tashkent</option>
				<option <?php if(isset($timezone)){ if($timezone == '5:30'){ echo "selected";} } ?> value='5:30'>(5:30) BOmbay,New Delhi,Calcatta</option>
				<option <?php if(isset($timezone)){ if($timezone == '5:45'){ echo "selected";} } ?> value='5:45'>(5:45) Kathmandu</option>
				<option <?php if(isset($timezone)){ if($timezone == '6:00'){ echo "selected";} } ?> value='6:00'>(6:00) Almaty,Dhaka,Colombo</option>
				<option <?php if(isset($timezone)){ if($timezone == '7:00'){ echo "selected";} } ?> value='7:00'>(7:00) Bangkok,Singapore,Hongkong</option>
				<option <?php if(isset($timezone)){ if($timezone == '8:00'){ echo "selected";} } ?> value='8:00'>(8:00) Perth</option>
				<option <?php if(isset($timezone)){ if($timezone == '9:00'){ echo "selected";} } ?> value='9:00'>(9:00) Tokyo,Yakutsk,Seoul</option>
				<option <?php if(isset($timezone)){ if($timezone == '9:30'){ echo "selected";} } ?> value='9:30'>(9:30) Adilide,Darwin,</option>
				<option <?php if(isset($timezone)){ if($timezone == '10:00'){ echo "selected";} } ?> value='10:00'>(10:00) Eastren Australia,Guam</option>
				<option <?php if(isset($timezone)){ if($timezone == '11:00'){ echo "selected";} } ?> value='11:00'>(11:00) Magadan</option>
				<option <?php if(isset($timezone)){ if($timezone == '011:00'){ echo "selected";} } ?> value='011:00'>(11:00) Solomon Islands,Newcoledonia</option>
				<option <?php if(isset($timezone)){ if($timezone == '12:00'){ echo "selected";} } ?> value='12:00'>(12:00) Auckland,Figi,Wellington</option>
				<option <?php if(isset($timezone)){ if($timezone == '012:00'){ echo "selected";} } ?> value='012:00'>(12:00) Kamchatka</option> </select>
			</select>
			</div>
		  </li>
	  </ul>
  </form>
  <div class="clear"></div>
  
  <!--CALL RATES DETIALS TABLE SECTION START-->
	<div class="cd-sf-sec">
		<table cellpadding="0" cellspacing="0" border="0" width="100%">
			<tr class="title">
			  <td width='20%'>Number</td>
			  <td width='20%'>Duration</td>
			  <td width='20%'>Charge</td>
			  <td width='20%'>Called Time</td>
			  <td width='20%'>End Time</td>
			</tr>
			<?php if(count($data['infoCdrs'])==0){ ?>
			<tr><td style="text-align:center;"colspan="5">No Data......</td></tr>
			<?php } ?> 
			</table>
		<ul id="itemContainer" style="margin:0px !important;padding:0px !important">
			<?php $r='';$PDate='';$e='';$EDate=''; 
			  if(count($data['infoCdrs'])!=''){
				foreach($data['infoCdrs'] as $data){
					
				$original_timestamp=$data['start'];
				$timestamp = (int)substr($original_timestamp,0,-3); 
			    $r=date('d M H:i a',$timestamp);
				
				$original_timestamp1=$data['stop'];
				$timestamp1 = (int)substr($original_timestamp1,0,-3);
				$e=date('d M H:i a',$timestamp1);
				
					if($minus!=''){
					//start					
					$r=date('Y-m-d H:i:s',$timestamp);$currentDate = strtotime($r);$oldDate = $currentDate-($minus);$PDate = date("d M H:i a", $oldDate);
					//stop
					$e=date('Y-m-d H:i:s',$timestamp1);$currentDate1 = strtotime($e);$curDate = $currentDate1-($minus);$EDate = date("d M H:i a", $curDate);
					}
					if($plus!=''){
					//start	
					$r=date('Y-m-d H:i:s',$timestamp);$currentDate = strtotime($r);$curDate = $currentDate+($plus);$PDate = date("d M H:i a", $curDate);
					//stop	
					$e=date('Y-m-d H:i:s',$timestamp1);$currentDate1 = strtotime($e);$curDate1 = $currentDate1+($plus);$EDate = date("d M H:i a", $curDate1);
					}
				?>
			 
			<table cellpadding="0" cellspacing="0" border="0" width="100%"><tr><td width='20%'><?php echo $data['calleeE164']; ?></td><td width='20%'><?php echo $data['feeTime']; ?></td><td width='20%'><?php echo $data['fee']; ?></td><td width='20%'><?php if($PDate!=''){ echo $PDate; }else{ echo $r; } ?></td><td width='20%'><?php if($EDate!=''){ echo $EDate;}else{echo $e;} ?></td></tr></table>
			 
			<?php } } ?>
			
		</ul>
		<?php if(isset($count)){ if($count!=0){ ?>
		<div class="holder"></div>
		<?php } } ?>
		
	</div>
  <!--CALL RATES DETIALS TABLE SECTION END-->
  <div class="clear"></div>
  
  </article>
  
  <!--INNER CONTENT RIGHT SECTION END-->
  
  </div>
  
  <!--CONTENT MAIN SECTION END-->
  
  <div class="clear"></div>
  
  <!--CLIENTS AREA SECTION START-->
  
  <aside class="content-main-sec ot-lg-sec"> <img src="<?php echo $this->basePath(); ?>/images/truste.jpg" alt=""> <img src="<?php echo $this->basePath(); ?>/images/secured.jpg" alt=""> <img src="<?php echo $this->basePath(); ?>/images/mcafeev.jpg" alt="">
    <h3 class="otg-title">Trusted. Safe. Reliable.</h3>
  </aside>
  
  <!--CLIENTS AREA SECTION END-->
  
  <div class="clear"></div>
  
  </section>

</div>

<!--CONTENT SECTION END--> 

</body>
</html>

<!--script start --> 
	<script type="text/javascript">
		function dateValue(){
			var picker1=$("#datepicker").val();
			var picker2=$("#datepicker_to").val();
			if(picker1==''){
				alert("Please select the From Date");
				return false;
			}
			if(picker2==''){
				alert("Please select the To Date");
				return false;
			}
			if(picker1!='' && picker2!=''){
				$("#formid").submit();
			}
		}
		function zoneTime(){
			$("#formid").submit();
		}
	</script>
	
<!-- script END--> 